<template>
  <div class="datas-wrap">
    <dataspart :datas="datas"></dataspart>
    <div class="pagination">
      <el-pagination background layout="prev, pager, next"
                     :total="param.recordCount"
                     :page-size="param.pageSize"
                     @current-change="changePage"></el-pagination>
    </div>
  </div>
</template>

<script>
  import Dataspart from "./dataspart";
  import DatasApi from '@/api/datas';

  export default {
	name: "datas",
	components: {Dataspart},
	data() {
	  return {
		datas: [],
		query: {},
		param: {
		  pageIndex: 1,
		  pageSize: 15,
		  recordCount: 0
		}
	  }
	},
	mounted() {
	  this.$emit("layout:load", "datas");
	  this.page(1);
	},
	methods: {
	  page: function (index) {
		this.param.pageIndex = index;
		DatasApi.page(this.query, this.param).then(res => {
		  this.param = res.obj.param;
		  this.datas = res.obj.data;
		});
	  },
	  changePage: function (index) {
		this.page(index);
	  }
	}
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  @require "../../ui/common/stylus/variable.styl"
  .datas-wrap {
    padding: 20px 20px 20px 40px;
  }
</style>